require (['./config'] , () => {
    require( ['template','header','footer'] , (template) => {
        class card  {
            constructor () {
                // this.getCard()
                this.render()
                
            }
            // getCard () {
            //     $.get('http://rap2.taobao.org:38080/app/mock/258485/api/home/carList' , resp => {
            //         console.log(resp)
            //       if ( resp.code === 200 ) {
            //         const { list } = resp.body
            //         $('#lvshowUl').html(template('lvshowUlTemplate',{list}))
            //       }
                    
            //     })
            // }
            render () {
                let cart = localStorage.getItem('cart')
                if (cart) {
                    this.cart = JSON.parse(cart)
                    console.log(this.cart)
                    $('#lvshowUl').html(
                        template('lvshowUlTemplate',{ list:this.cart })
                    )
                    this.cartOperate()
                } else {
                    //购物车为空
                    $('#lvshowUl').hide()
                    $('').show()

                }
            }
            cartOperate () {
                //cart有数据的时候一些操作
                this.setAllCheckStatus()
                this.calcTotalMoney ()
                this.numjia()
                this.checksChange()
                this.delButton()
            }
            setAllCheckStatus () {
                //根据数据 this.cart 是否全部选中来决定的
             const isAllCheck =  this.cart.every( shop => shop.check)
             $('#all-Check').prop('checked',isAllCheck)
            }
            calcTotalMoney () {
                const money = this.cart.reduce((total , shop) => {
                    if (shop.check) total += shop.price * shop.num
                    return total
                },0)
                $('#Paymoney').html(money)
            }
            checksChange () {
                console.log(this.cart)
                const _this = this
                $('.LvCheck').on('change',function () {
                    const isCheck = $(this).prop('checked') 
                    const id = $(this).parents('tr').data('id')
                    //根据id修改this.cart
                    _this.cart = _this.cart.map(shop => {
                        if (shop.id == id) {shop.check = isCheck}
                        return shop
                    })
                    //存localstorage
                    localStorage.setItem('cart', JSON.stringify(_this.cart))
                    //修改DOM
                    _this.setAllCheckStatus()
                    _this.calcTotalMoney ()
                })
            }
            numjia () {
                const _this = this
                $('.card-jia').on('click',function () {
                    var id = $(this).parents('tr').data('id'), 
                        arr = _this.cart.map(item => {
                            if( item.id == id) {
                                item.num++
                            } 
                            return item
                        })
                    console.log(arr)
                    localStorage.setItem('cart', JSON.stringify(arr))
                    _this.render ()
                })
                $('.card-jian').on('click',function () {
                    var id = $(this).parents('tr').data('id'), 
                        arr = _this.cart.map(item => {
                            if( item.id == id) {
                                if(item.num <= 1){
                                   item.num = 1  
                                }else{
                                    item.num--
                                }
                                
                            } 
                            return item
                        })
                    console.log(arr)
                    localStorage.setItem('cart', JSON.stringify(arr))
                    _this.render ()
                })
            }
            delButton (){
                const _this = this
                $('.lvdel').on('click', function () {
                    var id = $(this).parents('tr').data('id'),
                    arr = _this.cart.filter(item => item.id != id)
                    localStorage.setItem('cart', JSON.stringify(arr))
                    _this.render ()
                })
            }
            
            allCheckChange () {
                //全选框绑change时间
                
            }
        }
        return new card()
    })
}) 